<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>权限管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
#@css?("layui")
<title></title>
</head>
<body>
	<a class="layui-btn layui-btn-radius layui-btn-normal"
		href="javascript:window.history.go(-1);"><i class="layui-icon">&#xe65c;</i>返回</a>
	<fieldset class="layui-elem-field layui-field-title">
		<legend>权限管理</legend>
	</fieldset>
	<table class="layui-table">
		<thead>
			<tr>
				<th>ID</th>
				<th>菜单名称</th>
				<th>菜单链接</th>
			</tr>
		</thead>
		<tbody>
			#for(menu:mMenus)
			<tr>
				<td><input type="checkbox" name="check#(menu.id )"
					value="#(menu.id)" id="parent#(menu.id )" /></td>
				<td style="font-weight: bold">#(menu.name)</td>
				<td></td>
			</tr>
			#for(cmenu:cMenuMap.get(menu.id))
			<tr>
				<td><input name="check#(menu.id)" type="checkbox"
					value="#(cmenu.id)" id="child#(cmenu.id )" /></td>
				<td>&nbsp;&nbsp;&nbsp;&nbsp;ㅏ#(cmenu.name )</td>
				<td>#(cmenu.url )</td>
			</tr>
			#end #end
		</tbody>
	</table>
	#@js?('layui')
	<script type="text/javascript">
		layui.use([ 'table', 'jquery' ], function() {
			var table = layui.table, $ = layui.jquery;

			table.render()
			$(document).ready(function() {
				//初始化checkbox
				var temp = '#(midArr)';
				if (temp != null && temp.length > 0) {
					var initArr = JSON.parse('#(midArr)').midArr;
					for (var i = 0; i < initArr.length; i++) {
						var initInput = $("#parent" + initArr[i].mid);
						if (initInput.length > 0) {
							initInput.attr("checked", true);
						} else {
							initInput = $("#child" + initArr[i].mid);
							initInput.attr("checked", true);
						}
					}
				}
			});
			//获取到所有的checkbox并绑定onclick事件
			var arr = $.find('input');
			for (var i = 0; i < arr.length; i++) {
				var input = arr[i];
				if (input.type = 'checkbox') {
					input.onclick = ClickInput;
				}
			}
			//根据勾选不同的checkbox实现关联勾选
			function ClickInput() {
				debugger;
				var cid = this.id;
				var input;
				if (cid.indexOf("child") == 0) {
					var parentid = this.name.substring(5);
					input = document.getElementById("parent" + parentid);
					if (this.checked == true) {
						changeCheck(input, true);
					}
					changeCheck(this, this.checked);
				} else if (cid.indexOf("parent") == 0) {
					var childArr = $("input[name='check" + this.value + "']");
					for (var i = 0; i < childArr.length; i++) {
						input = childArr[i];
						if (input.type = 'checkbox') {
							changeCheck(input, this.checked);
						}
					}
				}
			}
			//checkbox实现全选
			function ClickAll(isCheck) {
				var arr = $.find("input[name='check']");
				for (var i = 0; i < arr.length; i++) {
					var input = arr[i];
					changeCheck(input, isCheck);
				}
			}

			//改变checkbox的勾选情况
			function changeCheck(input, isCheck) {
				$.ajax({
					type : "post",
					url : "#(ctx)/admin/power/update",
					async : false,
					data : {
						rid : '#(rid)',
						mid : input.value,
						isCheck : isCheck
					},
					dataType : "text",
					success : function(data) {
						input.checked = isCheck;
					}
				});
			}
		});
	</script>
</body>
</html>